<template>
  <div class="container">
    <div>我是父组件 {{money}}</div>
    <hr />
    <Son :money="money" @change-money="changeMoney"></Son>
  </div>
</template>

<script>
import {
  onBeforeMount,
  onMounted,
  reactive,
  toRefs,
  ref,
  computed,
  watch,
} from "vue";
import Son from './components/Son.vue'

export default {
  name: "App",
  components: {
    Son
  },
  // 父传子
  setup() {
    const money = ref (100)

    // 子传父
    const changeMoney = (newMoney) => {
      money.value = newMoney
    }
    return {money, changeMoney}
  },
};
</script>
